import {Component, Input, OnInit} from '@angular/core';
import {Product, products} from "../products";
import {ActivatedRoute} from "@angular/router";
import {CartService} from "../cart.service";

@Component({
    selector: 'app-product-details',
    templateUrl: './product-details.component.html',
    styleUrls: ['./product-details.component.scss']
})
export class ProductDetailsComponent implements OnInit {
    @Input() product: Product | undefined;

    x!: number;

    constructor(private route: ActivatedRoute, private cartService: CartService) {
    }

    ngOnInit() {
        // First get the product id from the current route.
        const routeParams = this.route.snapshot.paramMap;
        const productIdFromRoute = Number(routeParams.get('productId'));
        console.log('::  ', this.x)
        // Find the product that correspond with the id provided in route.
        this.product = products.find((p: Product) => p.id === productIdFromRoute);

    }

    addToCart(product: Product) {
        this.cartService.addToCart(product);
        window.alert('Your product has been added to the cart!');
    }
}
